<template>
  <div>
    <div class="head-top">
      <mt-header title="报纸">
        <mt-button icon="back" slot="left" @click='back'></mt-button>
        <mt-button slot="right" @click="toggle">
          <img src="../../../../static/book/book09.png" alt="" width="30px" height="30px" v-if="CollectNo.whetherCollection == 1" />
          <img src="../../../../static/book/book08.png" alt="" width="30px" height="30px" v-else/>
        </mt-button>
      </mt-header>
    </div>
    <div class="main">
      <div class="book-details">
        <div class="imgs">
          <!--<img src="../../../../static/baozhi.png" width="92px" height="130px" />-->
          <img :src="paperImgSrc+(parperdata.max_file_name||parperdata.fileName||parperdata.cover).substring(0,4)+'.jpg'" alt="" onerror="imgNo" width="92px" height="130px" />
        </div>
        <div class="info">
          <p v-text="parperdata.paper_name||parperdata.paperName||parperdata.fileId">南方晚报</p>
          <p>123万人阅读</p>
        </div>
      </div>

      <div class="cell">
        <router-link v-for="(item,index) in parperList" :key="index" :to='{name:"newscontentlist",params:{parperid:JSON.stringify(item.timestamp),parper_name:parperdata.paper_name||parperdata.paperName||parperdata.fileId}}'>
          <p class="time">第{{item.timestamp}}期</p>
        </router-link>

      </div>

      <p class="news-tabbar" @click="openFirstNewsparper()">
        立即阅读
      </p>
    </div>
  </div>
</template>

<script>
import api from "./../../../api/api.js";
import baseurl from "./../../../api/baseurl.js";
import { Indicator, Toast } from "mint-ui";

export default {
  data() {
    return {
      parperdata: [],
      parperList: [],
      imgNo: "../../../../static/baozhi.png",
      active: true,
      CollectNo:[]
    };
  },
  created() {
    this.paperImgSrc = api.paperImgSrc;
    this.userId = localStorage.getItem("userid");
    this.parperdata = JSON.parse(this.$route.params.parperdata);
    console.log(this.parperdata)
    this.datevalue = this.formatDate(new Date().getTime()); //时间
    // this.prePushTime = this.datevalue.substring(0, 11); //取年月日
    this.getinfoNewsList();
    this.isCollect();
  },
  methods: {
    openFirstNewsparper(){
      this.$router.push({
        name: "newscontentlist",
        params: { parperid: JSON.stringify(this.parperList[0].timestamp) }
      });
    },
    toggle() {
      if(this.CollectNo.whetherCollection == 1){
        this.delCollect();
      }else{
        this.addCollect();
      }
    },
     // 删除收藏
    delCollect() {
      const userid = localStorage.getItem("userid");
      this.$http({
        method: "post",
        url: baseurl.urls + "/collection/deleteCollection",
        params: {
          id: this.CollectNo.collectionId
        }
      })
        .then(response => {
          if (response.status == 200) {
            this.isCollect();
            Toast("删除成功"); 
            }
        })
        .catch(error => {
          console.log(error);
        });
    },
    // 查询图书记录
    isCollect() {
      const userid = localStorage.getItem("userid");
      const accid = localStorage.getItem("accid");
      const params = new URLSearchParams();
      params.append("columnType", 4);
      params.append("type", 0);
      params.append("userid", userid);
      params.append("fileid", this.parperdata.paper_name||this.parperdata.paperName||this.parperdata.fileId);
      params.append("edition", accid);
      this.$http({
        method: "post",
        url: baseurl.urls + "readrecord/selectBookMessage",
        data: params
      })
        .then(response => {
          this.CollectNo = response.data.date;
          console.log(this.CollectNo);
        })
        .catch(error => {
          console.log(error);
        });
    },
    addCollect() {
      const userid = localStorage.getItem("userid");
      const params = new URLSearchParams();
      params.append("userid", userid);
      //收藏类型 例如：1 图书 2悦读 3 视听 4 报纸 5 期刊 ...
      params.append("columntype", 4);
      //封面
      params.append("cover", this.parperdata.max_file_name||this.parperdata.fileName);
      //名称
      params.append("name", this.parperdata.paper_name||this.parperdata.paperName);
      //类型 1 图书 2 期刊  3 报纸  ....
      params.append("type", 0);
      //描述
      params.append("describe", "");
      //播放数量
      params.append("playback", "");
      //fileid 唯一值不能重复
      params.append("fileid", this.parperdata.paper_name||this.parperdata.paperName||this.parperdata.fileId);
      this.$http({
        method: "post",
        url: baseurl.urls + "collection/addCollection",
        data: params
      })
        .then(response => {
          if (response.status == 200) {
            Toast("收藏成功");
            this.isCollect();
          }
        })
        .catch(error => {
          console.log(error);
        });
    },
    back() {
      this.$router.back();
    },
    getinfoNewsList() {
      this.$http({
        method: "post",
        url: api.baseURL + "getCnkiGroupInformation",
        params: {
          inParam: {
            group: ["date"],
            constraint: [
              {
                name: "paper_name",
                value: this.parperdata.paper_name||this.parperdata.paperName||this.parperdata.fileId
              }
            ],
            time: this.datevalue,
            userId: this.userId,
            pageSize: 100,
            currentPage: 1,
            resourceType: 4,
            maxvalue: [],
            sysCode: "FH_PUBOPE"
          }
        }
      })
        .then(response => {
          if (response.status == 200) {
            const parperList = response.data.data;
            for (let item of parperList) {
              item.timestamp = this.timestampToTime(item.date);
            }
            this.parperList = parperList;
          }
        })
        .catch(error => {
          console.log(error);
        });
    }
  }
};
</script>

<style scoped>
.book-details {
  width: 100%;
  display: flex;
  align-items: center;
  background: #ffffff;
  box-sizing: border-box;
  min-height: 130px;
}

.book-details .imgs {
  margin: 20px 0px 20px 15px;
  height: 40px;
}

.book-details .imgs img {
  border-radius: 8px;
  height: 100%;
  width: 100px;
}

.info {
  margin-left: 25px;
  box-sizing: border-box;
}

.info p:nth-of-type(1) {
  margin-bottom: 14px;
  font-size: 18px;
  color: #252525;
}

.info p:nth-of-type(2) {
  margin-bottom: 14px;
  font-size: 13px;
  color: #a1a1a1;
}

.info p:nth-of-type(3) {
  font-size: 13px;
  color: #a1a1a1;
}

.news-tabbar {
  position: fixed;
  bottom: 0;
  left: 0;
}

.news-tabbar {
  width: 100%;
  height: 49px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #e60012;
  color: #ffffff;
}

.cell {
  margin-top: 16px;
  margin-bottom: 65px;
}

.time {
  width: 100%;
  height: 60px;
  background: #fff;
  margin-top: 2px;
  line-height: 60px;
  padding-left: 15px;
  box-sizing: border-box;
  font-size: 15px;
  font-weight: 600;
}
.time>img{
  margin-right: 10px;
}
</style>